<template>
	<div class="upfoods">
		<div class="flsb daybox fsize264">
			<div class="daytxt">日期</div>
			<picker mode="date"  @change="bindDateChange">
				<div class="datechoose" >
					<span class="datetxt">
					{{nowday}}
					</span>
					<image src="../../../static/details/goto.png" class="img32" mode=""></image>
				</div>
			</picker>
		</div>
		<div class="bcbox"></div>
		<div class='flcm pad32s'>
			<span class='spanwidth flcm'>
				<span class= 'lable'></span><span class='fsize28l'>分装袋流水号：</span><span class='fsize28'>#111</span>
			</span>
			
			<span class= 'lable'></span><span class='fsize28l'>耳号：</span><span class='fsize28'>N12871</span>
		</div>
		<div class='flcm pad32x'>
			<span class='spanwidth flcm'>
				<span class= 'lable'></span><span class='fsize28l'>精液量：</span><span class='fsize28'>200ml</span>
			</span>
			
			<span class= 'lable'></span><span class='fsize28l'>采集时间：</span><span class='fsize28'>2018-03-31</span>
		</div>
		<div class="bcbox"></div>
		<div class="breedinglist">
		
			<div class="breedinglistitem" v-for='item in 2' @click='gotosemendetails'>
					<div class="breedingli">
						<span class='fsize28l'>编号：</span><span class='fsize285'>#186</span>
					</div>
					<div class="breedingli">
						<span class='fsize28l'>耳号：</span><span class='fsize285'>#186</span>
					</div>
					<div class="breedingli">
						<span class='fsize28l'>所在猪舍号：</span><span class='fsize285'>3号</span>
					</div>
					<div class="breedingli">
						<span class='fsize28l'>所在猪栏号：</span><span class='fsize285'>3号</span>
					</div>
					<div class="breedingli">
						<span class='fsize28l'>出生日期：</span><span class='fsize285'>2020-03-31</span>
					</div>
					<div class="breedingli">
						<span class='fsize28l'>年龄：</span><span class='fsize285'>24个月</span>
					</div>
			</div>
		</div>
	</div>


</template>

<script>
	export default {
		data() {
			return {
				hour: 10,
				minute:50,
				second:32,
				nowday:'2020-05-18',
			};
		},
		onLoad: function() {
	
		},
		methods: {
			gotosemendetails(e) {
				uni.navigateTo({
					url: '../semendetails/semendetails' 
				});
			},
			bindDateChange(e) {
				this.nowday = e.target.value
			},
		}
	}
</script>

<style lang="less">
	.daybox {
		padding: 0 32rpx;
		line-height: 112rpx;
		.datechoose {
			display: flex;
			align-items:center;
		}
	}
	.spanwidth {
		width: 366rpx;
	}
	.pad32s {
		padding: 32rpx 0 16rpx 32rpx;
	}
	.pad32x {
		padding:  0 0 32rpx 32rpx;
	}
	.lable {
		width:6rpx;
		height:18rpx;
		background:rgba(24,108,242,1);
		border-radius:5rpx;
		margin-right: 14rpx;
	}
	
	.breedinglist {
		padding: 0 32rpx;
		.breedinglistitem {
			margin-top: 38rpx;
			padding: 24rpx;
			box-shadow:0px 4px 24px 0px rgba(0,0,0,0.12);
			border-radius:12px;
		}
	}
	
</style>
